{extend name='public/base' /}

{block name="style"}
{css href="/static/umeditor/themes/default/css/umeditor.css" /}
{css href="/node_modules/ztree/css/zTreeStyle/zTreeStyle.css" /}
{/block}

{block name="breadcrumb"}
{$crumbs}
{/block}

{block name="body"}
<div class="col-lg-12">
    <div class="ibox float-e-margins">
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-6 b-r">
                    <h3 class="m-t-none m-b"></h3>
                    <form role="form" action="{:url('save_category')}" method="post" autocomplete="off" data-form="form">
                        <div class="form-group">
                            <label>分类名称</label>
                            <input type="text" name="name" placeholder="accounts" class="form-control" value="{$cate.name|default=''}">
                        </div>
                        <div>
                            <input type="hidden" name="id" value="{$cate.id|default=0}">
                            <input type="hidden" name="pid" id="category_id" value="{$cate.pid|default=0}">
                            <button class="btn btn-sm btn-primary m-t-n-xs" type="submit"><strong>确定</strong></button>
                        </div>
                    </form>
                </div>
                <div class="col-sm-6 b-r">
                    <h3 class="m-t-none m-b"></h3>
                    <div class="form-group">
                        <label>上级分类</label>
                        <ul id="tree" class="ztree"></ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="javascript"}
{js href="/node_modules/ztree/js/jquery.ztree.core.js" /}
<script>

    var setting = {
        data: {
            simpleData: {
                enable: true
            }
        }
    };

    var zNodes ={$ztree};

    $(document).ready(function(){
        $.fn.zTree.init($("#tree"), setting, zNodes);
        //获取id为tree的zTree 对象
        var zTree = $.fn.zTree.getZTreeObj("tree");
        var category_id = {$cate.pid ? $cate.pid : 0};
        if (category_id > 0) {
            //选中指定节点,根据节点数据的属性搜索获取条件完全匹配的节点数据JSON对象
            zTree.selectNode(zTree.getNodeByParam("id", category_id));
        }
    });

</script>
{/block}